@import '../../../@theme/styles/themes';
@import '../../../../../node_modules/bootstrap/scss/mixins/_breakpoints';
@import '../../../../../node_modules/@nebular/theme/styles/global/bootstrap/_breakpoints';

@include nb-install-component() {

  /deep/ .ui-tabview .ui-tabview-panel{
    padding:0.25em;
  }

  /deep/ .option_2 .ui-tabview .ui-tabview-panel{
    padding:5px;
  }

  /deep/ .ui-inputtext{
    width: 221px;
  }
 
  /deep/ .ui-corner-all ul{
    border-radius: 0px;
    border-bottom:1px solid #ccc;
  }

  /deep/ .ui-corner-top{
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
  }

  /deep/ .ui-tabview{
    padding:0px;
  }

  /deep/ .ui-tabview .ui-tabview-nav li{
    margin:0px;
    padding:0px;
    border:0px;
  }

  /deep/ .ol_panel .ui-state-default{
    font-size:12px;
  }

  /deep/ .ui-state-default a{
    color:#000 !important;
  }

  /deep/ .ui-tabview-selected a{
    color:orange !important;
    border-bottom:1px solid orange;
  }

  /deep/ .ol_panel .ui-tabview .ui-tabview-nav > li.ui-state-default{
    background:#f2f4ff;
  }

  /deep/ .ui-tabview .ui-tabview-nav > li.ui-state-default{
    background:#fff;
  }

  /deep/ input,select{
    outline:none;
  }

  /deep/ .popup {
    position: absolute;
    background-color: white;
    -webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
    filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
    padding: 0px;
    border-radius: 0px;
    border: 1px solid #cccccc;
    bottom: 12px;
    left: -50px;
  }

  /deep/ .popup:after,
  .popup:before {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
  }

  /deep/ .popup:after {
    border-top-color: white;
    border-width: 10px;
    left: 48px;
    margin-left: -10px;
  }

  /deep/ .popup:before {
    border-top-color: #cccccc;
    border-width: 11px;
    left: 48px;
    margin-left: -11px;
  }

  /deep/ .popup-closer {
    text-decoration: none;
    position: absolute;
    top: 2px;
    right: 8px;
  }

  /deep/ .popup-closer:after {
    content: "✖";
  }
  /deep/ .popup-title {
    font-weight: normal;
    border-bottom: 1px solid #cccccc;
    padding: 4px 8px;
    background-color: #227ac9;
    color: white;
    font-size: 14px;
  }

  /deep/ .popup-content {
    padding-left: 8px;
    margin-top: 7px;
    font-family: "微软雅黑";
    font-size: 12px;
  }

  .map{
    width:100%;
    height:100%;
    //background: url('/assets/images/dynamics/map.png') no-repeat;
  }

  .btn-menu{
    position:absolute;
    top:10px;
    left:10px;
    padding:10px 2px;
  }

  .btn-menu ul{
    padding:0px;
    margin:0px;
  }

  .btn-menu ul li{
    list-style:none;
    margin-bottom:-5px;
    cursor:pointer;
    width:112px;
    text-align:center;
  }

  .left-box{
    width:360px;
    height:100%;
    position:absolute;
    border:1px solid #d9dadc;
    z-index:1000;
    top: 0px;
    left: 0px;
    background:#fff;
  }

.search-box{
    width:332px;
    margin:10px auto;
}
.search-box .hzqydiv{
 display: inline;
}
.search-box .pmtdiv{
    display: inline;
}
/deep/ .search-box .ui-button {
    margin-left: 10px;
}
/deep/ .search-box .pmtdiv .ui-button {
    border:1px solid #FF995F;
}
/deep/ .search-box .pmtdiv .ui-button .ui-button-text{
    background: #FF995F;
}
/deep/ .search-box .ui-button .ui-button-text{
    width: 150px;
}
.option_1{
    margin:5px auto;
  }
.option_3{
    overflow: hidden;
    height: 30px;
    background: #fff;
    margin:10px auto;
    border:1px solid #d9dadc !important;
  }
.search-box .option_lable{
  display: inline-block;
  height: 30px;
  margin: 6px auto;
}
  /deep/.option_3 .ui-multiselect{
    width: 250px;
    height: 30px;
  }
  /deep/.option_3  .ui-multiselect .ui-multiselect-label{
      margin-top: 2px;
  }
  .data_box{
    border-top:1px solid #d9dadc !important;
    width: 100%;
    height: 450px;
    margin-top: -5px;
    overflow-y: auto;overflow-x: hidden;
  }
  /*滚动条样式*/
  .data_box::-webkit-scrollbar {/*滚动条整体样式*/
    width: 4px;     /*高宽分别对应横竖滚动条的尺寸*/
    height: 4px;
  }
  .data_box::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
    border-radius: 5px;
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    background: rgba(0,0,0,0.2);
  }
  .data_box::-webkit-scrollbar-track {/*滚动条里面轨道*/
    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
    border-radius: 0;
    background: rgba(0,0,0,0.1);
  }
  .icon {
    font-size: 22px;
  }
  .option_4{
    width:110px;
    height:28px;
    border-color: #d9dadc;
    padding-left:10px;
    margin-right:15px;
    margin-bottom:5px;
  }

  .option_6{
    width:98px;
    height:29px;
    padding-left:10px;
    margin-right:15px;
    margin-bottom:5px;
    border:1px solid #d9dadc;
  }

  .option_5{
    width:180px;
    height:28px;
    border-color: #d9dadc;
    padding-left:10px;
    margin-right:13px;
  }

  .content-box{
    width:332px;
    margin:0px auto;
    display:none;
  }

  .chart{
    width:332px;
    background:#f2f4ff;
    position:relative;
    top:-10px;
    margin:0px auto;
    padding-bottom:20px;
    border:1px solid #d9dadc;
    border-top:0px;
  }

  .chart-box{
    width:332px;
    height:170px;
  }

  .chart-detail{
    width:95%;
    font-size:12px;
    text-indent: 28px;
    letter-spacing: 1px;
    text-align: justify;
    margin:0px auto;
  }

  .list-box{
    width: 332px;
    height: 80px;
    overflow: auto;
    /* border: 1px solid #d9dadc; */
    position: relative;
    background: #f5f5f5;
    border-top: 0px;
    margin: 10px auto;
  }

  .list{
    width:100%;
    padding:10px 0px 10px 0px;
    cursor:pointer
  }

  .list:hover{
    background:#f5f5f5;
  }

  .list h1{
    font-size:14px;
    padding-left:37px;
    font-weight:bold;
    background: url('/assets/images/dynamics/well/din.png') 15px no-repeat;
  }

  .tb{
    width:100%;
    padding:10px;
    font-size:13px;
  }

  .overlay{
    width:386px;
    height:378px;
    position:absolute;
    right:100px;
    bottom:80px;
    z-index:9000;
    background:#fff;
    box-shadow: 1px 1px 5px #d9dadc;
  }

  .ol_title{
    width:100%;
    height:30px;
    font-size:14px;
    font-weight:bold;
    border-bottom: 1px solid #d9dadc !important;
  }

  /*tab头*/
  .ol_title>div.dw{
    width: 200px;
    height: 30px;
    color: #333333;
    font-size: 14px;
    line-height: 30px;
    padding-left: 30px;
    background: url('/assets/images/dynamics/well/din.png') 10px no-repeat;
  }
  .tl{
    width: 270px;
    height:315px;
    float: left;
    background: url('/assets/images/dynamics/well/tuli.png') center no-repeat;
  }
  .ol_title>div.sc{
    width: 30px;
    height: 30px;
    float: right;
    line-height: 30px;
    padding-right: 12px;
    margin-top: -30px;
    background: url('/assets/images/dynamics/well/cancel.png') 10px no-repeat;
    cursor:pointer;
  }

  .ol_panel{
    width:100%;
  }

  .tab_info>div.tl{
    width: 270px;
    height:315px;
    float: left;
    background: url('/assets/images/dynamics/well/tuli.png') center no-repeat;
  }
  .table_tl{
    width: 309px;
    height: 315px;
    float: right;
  }

  .table th, .table td{
    padding:0.15rem;
    font-size: 12px;
  }

  .table-bordered{
    border:0px;
  }

  .table-bordered th, .table-bordered td {
    height:21px;
  }

  .table_sz{
    margin-top: 25px;
  }
  .table_sz>table{
    width: 296px;
    height: 153px;
  }
  .table_sz>table>tbody>tr>td:first-child{
    text-align: right;
    padding-right: 10px;
    background-color: #f0f3f4;
  }
  .table_sz>table>tbody>tr>td{
    font-size: 12px;
  }
  .table_sz>table>tbody>tr>td:nth-child(2){
    text-align: left;
    padding-left: 10px;
  }

  .col{background-color: #f9f9f9}
  .row:hover{background-color: #f9f9f9}

  .tl_table>div{
    margin-top: 10px;
    margin-bottom:11px;
  }
  tbody.bz_table>tr>td{
    border: none;
  }
  .tl_table>table>tbody>tr>td>span{
    width: 60px;
    padding-left: 40px;
  }
  .tl_table>table>tbody>tr.line_one>td:first-child>span{
    background: url('/assets/images/dynamics/well/ks.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_one>td:nth-child(2)>span{
    background: url('/assets/images/dynamics/well/ht.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_one>td:nth-child(3)>span{
    background: url('/assets/images/dynamics/well/ps.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_two>td:first-child>span{
    background: url('/assets/images/dynamics/well/ft.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_two>td:nth-child(2)>span{
    background: url('/assets/images/dynamics/well/htdf.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_two>td:nth-child(3)>span{
    background: url('/assets/images/dynamics/well/zs.png') left no-repeat;
  }

  .tl_table>table>tbody>tr.line_three>td:first-child>span{
    background: url('/assets/images/dynamics/well/fznt.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_three>td:nth-child(2)>span{
    background: url('/assets/images/dynamics/well/jls.png') left no-repeat;
  }

  .tl_table>table>tbody>tr.line_four>td:first-child>span{
    background: url('/assets/images/dynamics/well/gbt.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_four>td:nth-child(2)>span{
    background: url('/assets/images/dynamics/well/ls.png') left no-repeat;
  }
  .tl_table>table>tbody>tr.line_four>td:nth-child(3)>span{
    background: url('/assets/images/dynamics/well/sw.png') left no-repeat;
  }

  nb-card{
    height:540px;
  }

  nb-card-body{
    overflow: hidden;
  }

  @include media-breakpoint-down(sm) {
    ngx-traffic {
      display: none;
    }
  }

  @include media-breakpoint-down(is) {
    /deep/ nb-card.large-card {
      height: nb-theme(card-height-medium);
    }
  }
}




